<template>
  <div>
    <el-dialog title="收料通知单详情"  width="1200px" @open="open" class="icon-dialog" :visible.sync="show" :before-close="closeForm" append-to-body>
      <div>
        <el-button type="primary" size="small" icon="el-icon-check" @click="saveInspect"  :disabled="receform.isWeight">生成来料检验单</el-button>

      </div>
      <el-form ref="form" :model=" receform " size="small" label-width="200px" :inline="true" class="header">
        <el-row :gutter="20">
          <el-col :span="8">
            <vue-qr ref="qrCode" :text="qrText" style="margin: 0 20px 10px 0" width="220" height="220"></vue-qr>

          </el-col>
          <el-col :span="8">
            <el-form-item label="单据编号:" class="no-wrap-label" label-width="110px">{{ receform.billNo }}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="采购部门:" class="no-wrap-label" label-width="110px">{{ receform.purDept }}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="采购员:" class="no-wrap-label" label-width="110px">{{ receform.purChaser }}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="供应商名称:" class="no-wrap-label" label-width="130px">{{ receform.supplierName }}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="收料组织:" class="no-wrap-label" label-width="110px">{{ receform.orgName }}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="收料日期:" class="no-wrap-label" label-width="110px">{{ receform.date }}</el-form-item>
          </el-col>
<!--          <el-col :span="10">-->
<!--            <el-form-item label="收料员:" class="no-wrap-label">{{ receform.fmaterialnumber }}</el-form-item>-->
<!--          </el-col>-->
<!--          <el-col :span="10">-->
<!--            <el-form-item label="单据状态:" class="no-wrap-label">{{ receform.fmaterialnumber }}</el-form-item>-->
<!--          </el-col>-->
        </el-row>

        <br />
      </el-form>

      <el-table :data="receList" height="calc(100vh - 300px)">
        <!--        <el-table-column label="No." width="60" align="right" type="index"></el-table-column>-->
        <el-table-column label="单据编号" width="120" prop="billNo"></el-table-column>
        <el-table-column label="物料编码" width="120" prop="materialNumber"></el-table-column>
        <el-table-column label="物料名称" width="120" prop="materialName"></el-table-column>
        <el-table-column label="规格型号" width="120" prop="specification"></el-table-column>
        <el-table-column label="单位编码" width="120" prop="unitNumber"></el-table-column>
        <el-table-column label="单位名称" width="120" prop="unitName"></el-table-column>
        <el-table-column label="交货数量" width="120" prop="deliveQty"></el-table-column>
        <el-table-column label="批号" width="120" prop="lot">
          <template slot-scope="scope">
            <el-input v-model="scope.row.lot" placeholder="请输入批号" :disabled="receform.isWeight"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="是否下推" width="120" prop="isChecked" show-overflow-tooltip>
          <template slot-scope="scope">
            <el-tag :type="scope.row.isChecked === true ? 'success' : 'primary'">{{scope.row.isChecked === true ? '是' : '否'}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="下推数量" width="120" prop="inspectCount"></el-table-column>
        <el-table-column label="称重结果数量(实收数量)" width="120" prop="weightResultQty">
          <template slot-scope="scope">
            <el-input  @input="handleQuality(scope.row)" :disabled="receform.isWeight" v-model="scope.row.weightResultQty"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="异常数量" width="120" prop="abnormalQty"></el-table-column>
        <el-table-column label="仓库编码" width="120" prop="stockNumber"></el-table-column>
        <el-table-column label="仓库名称" width="120" prop="stockName"></el-table-column>
      </el-table>
    </el-dialog>

  </div>
</template>
<script>
import {detail,saveInspect} from '@/api/app/receive'
import vueQr from 'vue-qr/src/packages/vue-qr.vue'
export default {
	name:'receivedetail',
  components:{
    vueQr
  },
	props: {
		show: {
			type: Boolean,
			default: true
		},
		size: {
			type: String,
			default: 'mini'
		},
		info: {
			type: Object,
		},
	},
	data() {
		return {
        receform:{},
        receList:[],
        qrText:''

		}
	},
	watch:{
		show(val){
			if(val){
			}
		}
	},
	methods: {
    //填写实收数量
    handleQuality(e){
      const v = e.weightResultQty
      const zero = /^(0{2,})|[^0-9]/g
      let final = 0
      if (!v) {
        final = 0
      } else {
        final = v.toString().replace(zero, (v) => {
          return 0
        })

        if (final.split('')[0] * 1 === 0) {
          final = final.slice(1) - 0 || 0
        }
      }
      this.$nextTick(() => {
        e.weightResultQty = final.toString() || '0'
      })
    },
    //数量校验
    checkCount(arr){
      console.log(arr)
      //数量是否都大于0
      let res = arr.every(function(iterm){
        return iterm.weightResultQty > 0
      })
      //收货数量是否大于剩余领料数量
      let resQty = arr.every(function(iterm){
        return iterm.weightResultQty <= (iterm.deliveQty - iterm.inspectCount)
      })
      return res && resQty;
    },
    //生成来料检验单
    saveInspect(){
      //判断实收数量不能为0，并且时候数量不能大于剩余未交货数量
      let countRes = this.checkCount(this.receList)
      if (!countRes){
        this.$message({
          message:'收货数量必须大于0,并且不能大于剩余领料数量',
          type:'warning'
        })
        return
      }
      this.$confirm('是否确认生成来料检验单', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$message({
          type: 'success',
          message: '正在生成!'
        });
        saveInspect({billNo : this.receform.billNo,detail : this.receList}).then(res =>{
            if (res.data){
              this.$message({
                type: 'success',
                message: '生成成功!'
              });
              this.$emit('refresh_list'); // ✅ 通知父组件刷新
              this.closeForm()
            }
        })
      })
    },
		open(){
			detail(this.info).then(res => {
        if (res.status == 200) {
          this.receform = res.data.data;
          this.receList = res.data.dataList;
          this.qrText = res.data.qrCode;

        } else {
          this.$message.error('获取详情失败2，请稍后再试');
        }
      }).catch(error => {

        this.$message.error('获取详情失败，请稍后再试');
      });
		},
		closeForm(){
			this.$emit('update:show', false)
		}
	}
}
</script>
<style  lang="scss">
@import '@/assets/scss/common.scss';
</style>
